<template>
    <div class="sr-wrapper main">
        <nav-bar>
            <template v-slot:back>
                <back-button/>
            </template>
            <template v-slot:title>
                <h1 class="base-font-color">{{navTitle}}<span
                        v-if="$route.query.subTitle">-{{$route.query.subTitle}}</span></h1>
            </template>
            <template v-slot:right>
                <button class="base-button" @click="home">首页</button>
            </template>
        </nav-bar>
        <div class="sr-content">
            <table>
                <colgroup>
                    <col width="6%">
                    <col width="20%">
                    <col width="7%">
                    <col width="8%">
                    <col width="9%">
<!--                    <col width="9%">-->
                    <col width="9%">
                    <col width="10%">
                    <col width="10%">
                    <col width="10%">
                    <col width="10%">
                </colgroup>
                <thead>
                <tr>
                    <th rowspan="2">姓名</th>
                    <th rowspan="2">职务</th>
                    <th rowspan="2">出生年月</th>
                    <th rowspan="2">籍贯</th>
                    <th rowspan="2">入党时间<br>工作时间</th>
<!--                    <th rowspan="2">职务层级</th>-->
                    <th rowspan="1" colspan="4">学历学位</th>
                    <th rowspan="2">任现职务<br>层次时间</th>
                </tr>
                <tr>
                    <th rowspan="1" colspan="2">全日制教育</th>
                    <th rowspan="1" colspan="2">在职教育</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(item, i) in list" :key="i" @click="itemClick(item.PersionID)">
                    <td><span style="font-size: 18px; font-weight: bold;" v-html="transform(item.PersionName)"></span><br><span style="font-size: 18px; font-weight: bold;">({{item.Sex | sex}})</span>
                    </td>
                    <td>{{item.JobTitleDetail}}</td>
                    <td>{{item.Birthday | dateFormat}}<br>({{item.Birthday | age}}岁)</td>
                    <td>{{item.NativePlace}}</td>
                    <td>{{item.JoinPartyTime}}<br>{{item.StartingWorkDate | dateFormat}}</td>
<!--                    <td>{{item.LeaderLevelText}}<br>{{item.JobLevelTitleText}}</td>-->
                    <td>{{item.HighestFulltimeAcademicQualification}}<br>{{item.HighestarnFulltimeDegreeLevel}}</td>
                    <td>{{item.FulltimeSchoolAndMajor}}</td>
                    <td>{{item.HighestInServiceAcademicQualification}}<br>{{item.HighestInServiceDegreeLevel}}</td>
                    <td>{{item.InServiceSchoolAndMajor}}</td>
                    <td>
                        <!--                        <span v-if="item.LeaderLevelTime">{{item.LeaderLevelTime}}<br><span v-if="item.JobLevelTime">({{item.JobLevelTime}})</span></span>-->
                        <!--                        <span v-else>{{item.JobLevelTime}}</span>-->
                        {{item.OverallLevelTime | dateFormat}}
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</template>

<script>
    import {navbarMixin, filtersMixin, methodsMixin} from '../mixins';
    import {search, searchByIDCardNO} from "../api/search-resuult";
    import {advanceQuery} from "../api/advance";
    import {
        SelectPeople,
        GetPersionSimpleInfosByOrgID,
        SelectPeopleByIDCardNO,
        AdvancedQuery
    } from '../common/data-base/DataInterface';
    import {categoryAPI} from '../api/category';

    export default {
        name: "SearchResult",
        mixins: [navbarMixin, filtersMixin, methodsMixin],
        data() {
            return {
                navTitle: '查询结果',
                list: []
            }
        },
        computed: {
            count() {
                return this.list.length;
            },
            persionIDList() {
                return this.list.map(item => {
                    return item.PersionID;
                });
            }
        },
        created() {
            const {text, page, orgid, api} = this.$route.query;

            switch (page) {
                case '1':
                    this.navTitle = '关注内容';
                    console.log('关注内容');
                    if (this.$store.state.plusAlready) {
                        console.log(this.$store.state.attentionModule.attentionList);
                        SelectPeopleByIDCardNO(this.$store.state.attentionModule.attentionList).then(res => {
                            this.list = res;
                            console.log(JSON.stringify(this.list));
                        });
                    } else {
                        this.list = searchByIDCardNO(this.$store.state.attentionModule.attentionList);
                    }
                    break;
                case '2':
                    this.navTitle = '高级查询';
                    console.log('高级查询');
                    if (this.$store.state.plusAlready) {
                        AdvancedQuery(this.$store.state.advanceModule.advanceQuery).then(res => {
                            this.list = res;
                            console.log(JSON.stringify(this.list));
                        });
                    } else {
                        this.list = advanceQuery(this.$store.state.advanceModule.advanceQuery);
                    }
                    break;
                case '3':
                    console.log('组织机构');
                    if (this.$store.state.plusAlready) {
                        GetPersionSimpleInfosByOrgID(orgid).then(res => {
                            this.list = res;
                            console.log(JSON.stringify(this.list));
                        });
                    } else {
                        this.list = search(text);
                    }
                    break;
                case '4':
                    console.log('分类名册');
                    if (this.$store.state.plusAlready) {
                        categoryAPI[api]().then(res => {
                            this.list = res;
                            console.log(JSON.stringify(this.list));
                        });
                    } else {
                        this.list = search(text);
                    }
                    break;
                default:
                    console.log('search');
                    if (this.$store.state.plusAlready) {
                        SelectPeople(text).then(res => {
                            this.list = res;
                            console.log(JSON.stringify(this.list));
                        }).catch(err => {
                            console.log('读取数据库接口失败');
                            console.log(err);
                        });
                    } else {
                        this.list = search(text);
                    }
                    break;
            }
        },
        methods: {
            itemClick(PersionID) {
                this.$store.commit('setPagectrList', this.persionIDList);
                this.$router.push({path: '/resume', query: {PersionID: PersionID}});
            },
            home() {
                this.$router.push('/home');
            }
        }
    };
</script>

<style scoped lang="scss">
    @import "../assets/scss/define";

    .sr-wrapper {
        .back {
            width: 100px;
        }

        .sr-content {
            height: calc(100% - #{$navbar-height});
            width: 100%;
            overflow: auto;

            > table {
                width: 100%;
                border-collapse: collapse;
                color: $table-font-color;

                thead > tr {
                    background-color: $base-color;
                    color: white;

                    th {
                        border-color: white;
                        font-size: 18px;
                    }
                }

                tr {
                    height: 35px;

                    th, td {
                        border: 1px solid rgba($table-font-color, 0.6);
                        padding: 2px 0;
                        font-weight: normal;
                        font-size: 16px;
                    }
                }
            }
        }
    }
</style>
